<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page isELIgnored="false"%>
<html>
<!-- Mirrored from www.zi-han.net/theme/hplus/table_jqgrid.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 20 Jan 2016 14:20:02 GMT -->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>信息发布</title>
<%@ include file="/WEB-INF/pages/common/inc.jsp"%>
<!-- jqgrid-->
<link href="${ctxStatic}/css/plugins/jqgrid/ui.jqgridffe4.css?0820"
	rel="stylesheet">
<link href="${ctxStatic}/lib/themes/default/css/umeditor.css"
	type="text/css" rel="stylesheet">
<script type="text/javascript"
	src="${ctxStatic}/js/jquery.min.js"></script>
<script type="text/javascript"
	src="${ctxStatic}/js/jquery.form.js"></script>
<script type="text/javascript" charset="utf-8"
	src="${ctxStatic}/lib/umeditor.config.js"></script>
<script type="text/javascript" charset="utf-8"
	src="${ctxStatic}/lib/umeditor.min.js"></script>
<script type="text/javascript"
	src="${ctxStatic}/lib/lang/zh-cn/zh-cn.js"></script>
<style>
.ui-jqgrid-sortable,.jqgrow,.ui-pg-table,.EditTable {
	font-size: 12px;
}

.edui-container {
	margin: 30px auto;
}

#save {
	padding: 5px 100px;
	margin: 10px 20px;
	float: right;
}

#type {
	width: 180px;
}
#imgs{
	width:230px;
	height:100px;
	float:left;
	margin:10px 0px;
}
table td{
	font-size:12px;
	text-align: right;
	padding:0 5px;
}
#wep{
	height:auto;
	overflow: hidden;
}
.mui-file {
	padding: 5px 30px;
	height: 30px;
	line-height: 20px;
	margin: 5px auto;
	margin-top:150px;
	text-align: center;
	cursor: pointer;
	color: #1c84c6;;
	background: #fafafa;
	border: 1px solid #1c84c6;
	border-radius: 4px;
	position: relative;
}

.mui-file input {
	position: absolute;
	font-size: 100px;
	right: 0px;
	top: 0px;
	opacity: 0;
	filter: alpha(opacity=0);
	cursor: pointer
}

.mui-file:hover {
	color: #444;
	background: #eee;
	border-color: #ccc;
	text-decoration: none
}
</style>
</head>

<body>
	<table id="table_list_2"></table>
	<div id="pager_list_2"></div>
	<div id="wep">
		<table class="table">
			<tr hidden>
				<td><input type="text" id="id"></td>
			<tr>
			<tr>
				<td>资讯类型</td>
				<td><select class="form-control" id="type">
						<option value="1" selected="selected">新闻资讯</option>
						<option value="2">技术</option>
						<option value="3">文章</option>
						<option value="4">视频</option>
						<option value="5">展会</option>
				</select></td>
			</tr>
			<tr>
				<td>标题</td>
				<td><input type="text" class="form-control" id="title"></td>
			</tr>
			<tr>
				<td>封面</td>
				<td>
					<img src="" id="imgs" class="imgs">
					<div class="mui-file">点击这里上传图片
					<form id="form1" action="${ctxStatic}/lib/jsp/imageUp.jsp?editorid=myEditor"
						method="post" enctype="multipart/form-data">
						<input type="file" class="form-control" id="imgurl"  name="upfile" />
					</form> 
					</div>
				</td>
			</tr>
		</table>
		<script type="text/plain" id="myEditor"
			style="width: 99%; height: 400px;">
	</script>
		<button class="btn btn-success btn-outline " id="save">发布</button>
	</div>
	<script src="${ctxStatic}/js/plugins/peity/jquery.peity.min.js"></script>
	<script
		src="${ctxStatic}/js/plugins/jqgrid/i18n/grid.locale-cnffe4.js?0820"></script>
	<script
		src="${ctxStatic}/js/plugins/jqgrid/jquery.jqGrid.minffe4.js?0820"></script>
	<script src="${ctxStatic}/js/content.min.js?v=1.0.0"></script>
		<script>
		//实例化编辑器
		var um = UM.getEditor('myEditor');
		$(document).ready(function() {
			$("#save").on("click",function(){
				var title=$("#title").val();
				var context=UM.getEditor('myEditor').getContent();
				var url=$("#url").val();
				var imgurl=$("#imgs").attr("src");
				var type=$("#type").val();
				var id=$("#id").val();
				var param="addnews";
				if(id==""){
					 param="addnews";
				}else{
					param="updatenews";
				}
				$.post('${ctx}/admin/info/'+param,{
					title:title,
					context:context,
					url:url,
					imgurl:imgurl,
					type:type,
					id:id
				},function(data){
					if(data==true){
						window.location.href=window.location.href;
						alert("操作成功");
					}else{
						alert("操作失败");
					}
				})
			})
			$("#table_list_2").css('fontSize', '14px');
			$("#pager_list_2").css('fontSize', '14px');
			$.jgrid.defaults.styleUI = "Bootstrap";
			$("#table_list_2").jqGrid({
				url : '${ctx}/admin/info/listnews',
				datatype : "json",
				height : "400",
				autowidth : true,
				shrinkToFit : true,
				rownumbers : true,
				viewrecords : true,
				rowNum : 10,
				rowList : [ 10, 20, 30 ],
				colNames : [ "序号", "标题", "内容", "日期", "图片", "类型"],
				colModel : [ {
					name : "id",
					index : "id",
					editable : true,
					hidden : true,
					key : true
				}, {
					name : "title",
					index : "title",
					editable : true
				}, {
					name : "context",
					index : "context",
					hidden : true,
					editable : true
				}, {
					name : "date",
					index : "date",
					editable : true
				}, {
					name : "imgurl",
					index : "imgurl",
					editable : true,
					hidden:true
				}, {
					name : "type",
					index : "type",
					editable : true,
					edittype : "select",
					editoptions : {
						value : "1:新闻资讯;2:技术;3:文章;4:视频;5:展会"
					},
					formatter:function(cellvalue, options, rowObject){
						if(cellvalue == '1'){
							return "新闻资讯";
						} else if(cellvalue == '2'){
							return "技术";
						} else if(cellvalue == '3'){
							return "文章";
						}else if(cellvalue == '4'){
							return "视频";
						}else if(cellvalue == '5'){
							return "展会";
						}
					}
				}],
				pager : "#pager_list_2",
				sortname : 'id',
				editurl : "${ctx}/admin/user/editnews",
				sortorder : "desc"
			});
			$("#table_list_2").jqGrid("navGrid", "#pager_list_2", {
				edit : false,
				add : false,
				del : true,
				search : false
			}, {

			}, {

			}, {
				url : "${ctx}/admin/info/delnews"
			}, {});
			$("#table_list_2").jqGrid('navButtonAdd', '#pager_list_2', {
			    caption : "编辑",
			    onClickButton : function() {
			      var id = $("#table_list_2").jqGrid('getGridParam', 'selrow');
			      if (id) {
			    	  var ret = $("#table_list_2").jqGrid('getRowData', id);
			          $("#title").val(ret.title);
			         console.log( $("#type").find("option:selected").text(ret.type));
			         $("#imgs").attr('src',ret.imgurl);
			          $("#id").val(ret.id);
			          UM.getEditor('myEditor').setContent(ret.context);
			      } else {
			        alert("请选择要编辑的数据");
			      }
			    }
			  });
			$("#imgurl").bind("change",function(){
				$('#form1').ajaxSubmit(function(data){
					data=JSON.parse(data);
					url="${ctxStatic}/lib/jsp/"+data.url;
					$("#imgs").attr('src',url);
				});
			});
		});
	</script>
</body>
</html>